<template>
  <div id="home">
    <el-container>
      <el-header>
        <img src="../../image/logo.png">问卷调查
        <el-tag size="mini" type="text">{{userInfo.username}}</el-tag>
        <el-button @click="logout()" type="text">注销</el-button>
      </el-header>
      <el-container>
        <el-aside width="200px">
          <el-menu :router="true">
            <el-menu-item
              v-for="menu in menus"
              :key="'menu_'+menu.id"
              :index="menu.router"
            >{{menu.menu_name}}</el-menu-item>
          </el-menu>
        </el-aside>
        <el-main>
          <router-view></router-view>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
export default {
  data() {
    return {
      menus: []
    };
  },
  computed: {
    userInfo() {
      return this.store.get("userInfo");
    }
  },
  created() {
    this.getUsers();
    this.getMenus();
    this.$root.$on('updateMenus',()=>{
      this.getMenus()
    });
  },
  beforeRouteEnter(to, from, next) {
    next(vm => {
      vm.axios.get("/users/islogin").then(ret => {
        let { data, error } = ret.data;
        if (data == 0) {
          vm.$router.push("/login");
        }
      });
    });
  },
  methods: {
    getMenus() {
      this.axios.get("/menus",{
        params:{
          status:1
        }
      }).then(ret => {
        let { data, error } = ret.data;
        this.menus = data;
      });
    },
    logout() {
      this.axios.get("/users/logout").then(() => {
        this.$router.push({ name: "login" });
      });
    },
    getUsers() {
      this.axios
        .get("/users")
        .then(ret => {
          let { data, error } = ret;
          if (error == 1) {
            this.$router.push({ name: "login" });
            return;
          }
        })
        .catch(() => {});
    }
  }
};
</script>

<style scoped>
</style>
